<template>
  <section style="padding-bottom: 30px;">
    <div class="big_pt" v-if="message == '请求成功'">
      <div class="tit">
        <img src="../../assets/index/line.png" class="line">
        <span class="weight">车辆信息</span>
      </div>
      <ul>
        <li>
          <span>车架号</span>
          <span>{{rcarvin}}</span>
        </li>
        <li>
          <span>车辆颜色</span>
          <span>{{bodyColor}}</span>
        </li>
        <li>
          <span>车型</span>
          <span>{{modelName}}</span>
        </li>
        <li>
          <span>车型id</span>
          <span>{{modelNameId}}</span>
        </li>
        <li>
          <span>品牌</span>
          <span>{{brand}}</span>
        </li>
        <li>
          <span>品牌id</span>
          <span>{{brandId}}</span>
        </li>
        <li>
          <span>款型名称</span>
          <span>{{typeName}}</span>
        </li>
        <li>
          <span>款型id</span>
          <span>{{modeiId}}</span>
        </li>
        <li>
          <span>车辆类型</span>
          <span>{{vehicleType}}</span>
        </li>
        <li>
          <span>生产日期</span>
          <span>{{makeDate}}</span>
        </li>
        <li>
          <span>排放标准</span>
          <span>{{effluentStandard}}</span>
        </li>
        <li>
          <span>排量</span>
          <span>{{cc}}</span>
        </li>
        <li>
          <span>发动机号</span>
          <span>{{engineNumber}}</span>
        </li>
        <li>
          <span>发动机型号</span>
          <span>{{engineModel}}</span>
        </li>
        <li>
          <span>最大功率（KW）</span>
          <span>{{maxJourney}}</span>
        </li>
        <li>
          <span>油耗</span>
          <span>{{oilConsumption}}</span>
        </li>
        <li>
          <span>整备质量（kg）</span>
          <span>{{curbWeight}}</span>
        </li>
        <li>
          <span>总质量（kg）</span>
          <span>{{crossWeight}}</span>
        </li>
        <li>
          <span>核定载客数</span>
          <span>{{passengers}}</span>
        </li>
        <li>
          <span>批次</span>
          <span>{{batch}}</span>
        </li>
        <li>
          <span>发证日期</span>
          <span>{{dateIssuing}}</span>
        </li>
      </ul>
    </div>
    <div v-else>
      <img src="../../assets/sech/no_tip.png" style="width: 4rem;margin-top: .86rem;">
      <p style="margin-top: .3rem;color: #666;">{{message}}</p>
    </div>
  </section>
</template>

<script>
  export default {
    name: "carVinResult",
    data() {
      return {
        message:'',
        rcarvin:'',
        modelName:'',
        modelNameId:'',
        brand:'',
        brandId:'',
        typeName:'',
        modeiId:'',
        makeDate:'',
        bodyColor:'',
        vehicleType:'',
        effluentStandard:'',
        engineNumber:'',
        engineModel:'',
        cc:'',
        maxJourney:'',
        oilConsumption:'',
        curbWeight:'',
        crossWeight:'',
        passengers:'',
        batch:'',
        dateIssuing:'',
      }
    },
    created() {
      let RESULTINFO = JSON.parse(sessionStorage.getItem('TO_OBJECT'));
      console.log(RESULTINFO)
      this.message = RESULTINFO.message;
      if(this.message == '请求成功'){
        this.rcarvin = RESULTINFO.resultInfo.vin;
        this.modelName = RESULTINFO.resultInfo.modelName;
        this.modelNameId = RESULTINFO.resultInfo.modelNameId;
        this.brand = RESULTINFO.resultInfo.brand;
        this.brandId = RESULTINFO.resultInfo.brandId;
        this.typeName = RESULTINFO.resultInfo.typeName;
        this.modeiId = RESULTINFO.resultInfo.modeiId;
        this.makeDate = RESULTINFO.resultInfo.makeDate;
        this.bodyColor = RESULTINFO.resultInfo.bodyColor;
        this.vehicleType = RESULTINFO.resultInfo.vehicleType;
        this.effluentStandard = RESULTINFO.resultInfo.effluentStandard;
        this.engineNumber = RESULTINFO.resultInfo.engineNumber;
        this.engineModel = RESULTINFO.resultInfo.engineModel;
        this.cc = RESULTINFO.resultInfo.cc;
        this.maxJourney = RESULTINFO.resultInfo.maxJourney;
        this.oilConsumption = RESULTINFO.resultInfo.oilConsumption;
        this.curbWeight = RESULTINFO.resultInfo.curbWeight;
        this.crossWeight = RESULTINFO.resultInfo.crossWeight;
        this.passengers = RESULTINFO.resultInfo.passengers;
        this.batch = RESULTINFO.resultInfo.batch;
        this.dateIssuing = RESULTINFO.resultInfo.dateIssuing;
      }
    }
  }
</script>

<style scoped>
  .line {
    width: 5px;
    height: 25px;
    position: absolute;
    left: 0;
  }

  .tit {
    display: flex;
    align-items: center;
    height: 1rem;
  }

  .big_pt {
    padding: 0rem .3rem 0rem .3rem;
    box-shadow: 2px 2px 10px rgba(128, 128, 128, .2);
  }

  .big_pt ul {
    padding-top: .3rem;
    border-top: 1px solid #f2f2f2;
  }

  .big_pt li {
    display: flex;
    text-align: left;
    padding-bottom: .3rem;
    align-items: center;
  }
  .big_pt li span:nth-child(1) {
    width: 2.4rem;
    color: #929292;
    flex: none;
  }

</style>
